﻿<template>
  <div class="h-full flex flex-col">
    <!-- 根据授权状态显示不同组件 -->
    <Auth v-if="!isAuthorized" type="WECHAT" @bind="handleBind" @apply="handleApply" />
    <List v-else type="WECHAT" @refresh-auth-status="checkAuthStatus" @go-to-auth="handleGoToAuth" />
  </div>
</template>

<script setup>
  import Auth from "./components/Auth.vue";
  import List from "./components/List.vue";

  // 授权状态
  const isAuthorized = ref(false);

  // 检查授权状态
  const checkAuthStatus = async () => {
    try {
      // TODO: 调用接口检查授权状态
      const res = await Api.channel.GetMiniProgramAuthResult({ miniType: "WECHAT" });
      isAuthorized.value = res.data;
    } catch (error) {
      console.error("检查授权状态失败:", error);
      isAuthorized.value = false;
    }
  };

  // 处理绑定事件
  const handleBind = async () => {
    try {
      console.log("开始绑定微信小程序"); // TODO: 调用绑定接口
      const res = await Api.channel.GetWechatQrcode();
      window.open(res, "_blank");
      // await checkAuthStatus();
    } catch (error) {
      console.error("绑定失败:", error);
    }
  };

  // 处理申请事件
  const handleApply = () => {
    console.log("跳转到微信开放平台申请小程序");
    // TODO: 跳转到微信开放平台
    window.open("https://mp.weixin.qq.com/", "_blank");
  };

  // 处理跳转到授权页面事件
  const handleGoToAuth = () => {
    isAuthorized.value = false;
  };

  // 页面加载时检查授权状态
  onActivated(() => {
    checkAuthStatus();
  });
</script>
